/* List */

ul.person-leftbar {
    list-style-type: none;
    padding: 0;
    margin: 0;

    /* view-transition-name: main-leftbar; */
}

ul.person-leftbar li {
    padding-bottom: 2px;
    padding-left: 0;
}

ul.person-leftbar li a {
    color: var(--text-color);
    text-decoration: none;
    margin: 0;

    display: flex;
}

ul.person-leftbar li button {
    padding: 0;
    border: none;
    font: inherit;
    color: inherit;
    background-color: transparent;
    cursor: pointer;
    padding: 10px 20px;

    display: flex;
    align-items: center;
    border-radius: 8px;

    width: 100%;
    transition: .3s background;
}

ul.person-leftbar li button:hover,
ul.person-leftbar li button:focus {
    background: var(--bg-light-hover);
}

ul.person-leftbar li button.active {
    background: var(--bg-light-active);
    /* outline: 1px solid var(--bg-light-active-hover); */
}

ul.person-leftbar li button.active:hover,
ul.person-leftbar li button.active:focus {
    background: var(--bg-light-active-hover);
}

ul.person-leftbar li button svg {
    fill: var(--left-bar-icon);
    margin-right: 1rem;

    transform: scale(0.9);
    transition: .3s;
}

ul.person-leftbar li button:hover svg,
ul.person-leftbar li button:focus svg {
    transform: scale(1);
}

@media(max-width: 991px) {
    ul.person-leftbar li button svg {
        display: none !important;
    }
}
